<template>
    <view id="upload">
        <uv-upload :fileList="file" :accept="accept" :imageMode="imageMode" :maxSize="maxSize" @beforeRead="beforeRead"
            @afterRead="afterRead" @delete="(e: any) => emit('delete', e)" @oversize="oversize"
            @clickPreview="(e: any) => emit('clickPreview', e)" :disabled="disabled" :uploadText="uploadText"
            :compressed="compressed" :capture="capture" :maxDuration="maxDuration" :multiple="multiple"
            :uploadIcon="uploadIcon" :uploadIconColor="uploadIconColor" />
    </view>
</template>

<script setup lang="ts">
import { uploadFile } from '@/api'
import { onLoad } from '@dcloudio/uni-app'
import { computed } from 'vue'
import { useI18n } from 'vue-i18n'



interface P {
    modelValue: {
        errMsg: string;
        fileID: string;
        statusCode: number;
        url: string;
    }[],

    disabled?: boolean
    uploadText?: string
    accept?: 'image' | 'video' | 'all' | 'media',
    sizeType?: ('original' | 'compressed')[],
    capture?: ('album' | 'camera')[]
    compressed?: boolean
    maxDuration?: number
    uploadIcon?: string
    uploadIconColor?: string
    useBeforeRead?: boolean
    previewFullImage?: boolean
    previewFullVideo?: boolean
    maxCount?: number
    imageMode?: string
    name?: string
    multiple?: boolean
    deletable?: boolean
    maxSize?: number
    width?: string | number
    height?: string | number
    previewImage?: boolean
    customStyle?: Record<string, any>

}

const prop = withDefaults(defineProps<P>(), {
    modelValue: () => [],
    disabled: false,
    accept: 'image',
    capture: () => ['album', 'camera'],
    compressed: true,
    camera: 'back',
    maxDuration: 60,
    uploadIcon: 'camera',
    uploadIconColor: '#FD754C',
    useBeforeRead: false,
    previewFullImage: true,
    previewFullVideo: true,
    maxCount: 9,
    imageMode: 'aspectFill',
    sizeType: () => ['original', 'compressed'],
    multiple: true,
    deletable: true,
    width: 160,
    height: 160,
    previewImage: true,
    maxSize: 9,
    customStyle: () => {
        return {

        }
    }
})

const file = computed(() => {
    return prop.modelValue?.map(e => {
        return {
            url: e.url,
            status: 'success'
        }
    }) || []
})

onLoad(() => {

})



const emit = defineEmits(['update:modelValue', 'beforeRead', 'afterRead', 'oversize', 'clickPreview', 'delete'])


async function beforeRead(f: any) {
    console.log(f)
    emit('beforeRead', f)

}
const $t = useI18n().t

async function afterRead(f: any) {
    console.log(f)
    emit('afterRead', f)
}


async function oversize(f: any) {
    console.log(f)
    if (Array.isArray(f.file)) {
        for (const v of f.file) {
            const data = await uploadFile(v)
            emit('update:modelValue', prop.modelValue ? prop.modelValue.concat(data) : [data])
        }
    } else {
        const data = await uploadFile(f.file)
        emit('update:modelValue', prop.modelValue ? prop.modelValue.concat(data) : [data])
    }

    emit('oversize', f)
}

</script>
